<template>
	<view>
		<Header title="我的"  :backshow="true"></Header>
		<view class="toubu">
				<!-- 我的头部 -->
				<view class="me_header">
					<image :src="geren.self.avatar"></image>
					<view class="me_header_con">
						<view class="me_header_nicheng">
							<view class="me_header_nicheng">{{geren.self.nick_name}}<text>{{geren.self.remark}}</text></view>
							<view class="me_header_zhanghao" style="margin-top:16rpx;">{{geren.self.shopname}}</view>
						</view>
						<view>
							<view class="me_header_zhanghao me_jiantou" @click="publics.navigateTo('/view/me/ziliao?state=1')">个人资料
								<image src="/static/image/me/you.png"></image>
							</view>
						</view>
					</view>
				</view>
				
				<view class="money"  v-if="userinfo.shenfen==0">
					<view class="chongzhi">
						<view class="kezi">
							<view>客资余额</view>
							<view>￥<text>{{geren.self.shopcmmoney}}</text></view>
						</view>
						<view class="kezi">
							<view>成交余额</view>
							<view>￥<text>{{geren.self.shopdealmoney}}</text></view>
						</view>
					</view>
					<view class="chongzhi_ye" @click="publics.navigateTo('/pages/public/reCharge')">
						余额充值
					</view>
					<!-- <view class="xiaofei_mx" @click="publics.navigateTo('/view/me/xiaofei?state=1')">
						消费明细
					</view> -->
				</view>
				
				<view class="mindlo_lj" v-if="userinfo.shenfen==0">
					<view class=" leiji_">
						<view class="leiji" >
							<view class="leiji_ts">
								<image src="/static/image/me/leiji.png" mode=""></image>
								<view>累计推送</view>
							</view>
							<view class="leiji_ck"  @click="publics.navigateTo('/view/me/tuisong?state=1')">
								<view>查看</view>
								<image src="/static/image/me/you.png" mode=""></image>
							</view>
						</view>
						<view class="kezi_zs">{{geren.leijinum}}客资</view>
					</view>
					<view class="leiji_">
						<view class="leiji">
							<view class="leiji_ts">
								<image src="/static/image/me/zaigang.png" mode=""></image>
								<view>在岗员工</view>
							</view>
							<view class="leiji_ck"  @click="publics.navigateTo('/view/me/yuangong_gl')">
								<view>管理</view>
								<image src="/static/image/me/you.png" mode=""></image>
							</view>
						</view>
						<view class="kezi_zs">{{geren.usernum}}人</view>
					</view>
				</view>
				
				<view class="me_tubiao shadow" >
					<view class="me_content_jine_left" >
						<view class="me_content_list" v-for="(item,index) in list" @click="publics.navigateTo(item.url)" v-if="item.state==userinfo.shenfen||item.state==2">
							<image :src="item.image"></image>
							<view class='me_content_list_list' >
								<view>{{item.name}}</view>
								<image src="/static/image/me/you_h.png"></image>
							</view>
						</view>
					</view>
				</view>
				
				
				<view class="anniu" style="margin:60rpx auto" @click="tuichu">退出登录</view>
				
		</view>
		  <requestLoading></requestLoading>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
					name: '充值记录',
					state: 0,
					image: '/static/image/me/chongzhi.png',
					url:'/view/me/xiaofei?state=0'
				},{
					name: '消费明细',
					state: 0,
					image: '/static/image/me/xiaofei.png',
					url:'/view/me/xiaofei?state=1'
				},{
					name: '修改密码',
					state: 2,
					image: '/static/image/me/xiugai.png',
					url:'/view/me/mima'
				}, {
					name: '店铺信息',
					state: 2,
					image: '/static/image/me/dianpu.png',
					url:'/view/me/ziliao?state=0'
				}, {
					name: '关于我们',
					state: 2,
					image: '/static/image/me/women.png',
					url:'/view/me/women'
				}],
				state:0,   //0店铺  1个人
				geren:{
					self:{},
					leijinum:'',
					usernum:""
				},
				tishi: 1, //展示加载动画
				userinfo:{
					shenfen:'',   //0商家  1员工
				}
			}
		},
		onLoad() {
			// this.wodeyemian()
		},
		onShow: function() {
			this.wodeyemian()
		},
		onPullDownRefresh() {
		   	this.tishi=2;
			// uni.showToast({
			// 	title: '刷新成功',
			// 	icon: "none"
			// });
			this.wodeyemian()
			console.log("触发下拉刷新")
		}, 
		methods: {
			
			wodeyemian() {
					var that = this;
					this.configure.ajax({
					url: "wode/xiangqing",
					tishi: that.tishi,
					data: {},
					method: 'POST',
					success: (res)=> {
						console.log('fanhui');
						that.geren = res.data;
						that.tishi='111';
						uni.setStorageSync('shopaddress', res.data.self.shopaddress);
						that.userinfo.shenfen=res.data.self.type;
					},
				})
			},
			tuichu(){
				this.publics.reLaunch('/view/public/login')
				uni.removeStorageSync('token_token');
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	.me_content_list:last-child .me_content_list_list {
		border-bottom: none !important;
	}
	.me_header {
		width: calc(100% - 60rpx);
		margin: 0 auto;
		overflow: hidden;
		display: flex;
		margin-bottom: 50rpx;
		margin-top: 20rpx;
		image {
			width: 120rpx;
			height: 120rpx;
			border-radius: 50%;
			margin-right: 32rpx;
		}
	}
	.me_header_con {
		width: calc(100% - 150rpx);
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.me_header_nicheng {
		font-size: 30rpx;
		color: $heise_ziti;
		font-weight: bold;
	
		text {
			font-size: 20rpx;
			color: $white_ziti;
			font-weight: 400;
			padding: 4rpx 12rpx 6rpx 12rpx;
			background: $zhuce_color;
			border-radius: 6rpx;
			margin-left: 12rpx;
		}
	}
	.me_header_zhanghao {
		font-size: 24rpx;
		color: $qianhui_ziti;
		image {
			margin-left: 10rpx;
			margin-right: 0rpx;
			width: 14rpx !important;
			height: 24rpx !important;
		}
	}
	.me_jiantou {
		display: flex;
		align-items: center;
	}
	.money{
		background-image: url("/static/image/me/back_i.png");
		background-size: 100% 100%;
		width: calc(100% - 30rpx) !important;
		margin: auto;
		height: 350rpx;
	}
	.chongzhi{
		display: flex;
		justify-content: space-around;
	}
	.kezi{
		text-align: center;
		margin-top: 60rpx;
	}
	.kezi view:first-child{
		font-size: 26rpx;
		color: $qianhuione_ziti;
		margin-bottom: 30rpx;
	}
	.kezi view:last-child text{
		font-size: 34rpx;
		color: $heise_ziti;
		font-weight: bold;
	}
	.kezi view:last-child{
		color: $heise_ziti;
		font-weight: bold;
		font-size: 24rpx;
	}
	.chongzhi_ye{
		width: 300rpx;
		height: 70rpx;
		background-color: $zhuce_color;
		text-align: center;
		line-height: 70rpx;
		font-size: 30rpx;
		color: $white_ziti;
		border-radius: 12rpx;
		margin: 50rpx auto 40rpx auto;
	}
	.xiaofei_mx{
		font-size: 26rpx;
		color: $zhuce_color;
		width: calc(100% - 586rpx);
		border-bottom: $zhuce_color 2rpx solid;
		margin: auto;
		margin-bottom: 50rpx;
	}
	.mindlo_lj{
		display: flex;
		justify-content: space-between;
		
		width: calc(100% - 60rpx);
		margin: auto;
		margin-top: 14rpx;
	}
	.leiji_{
		width: calc(100% - 360rpx);
		box-shadow: $shadow ;
		// margin-top: 30rpx;
		border-radius: 12rpx;
	}
	.leiji{
		display: flex;
		vertical-align:middle;
	}
	.leiji_ts{
		display: flex;
		font-size: 30rpx;
		color: $qianhuione_ziti;
		align-items: center;
		margin: 24rpx 0rpx 15rpx 30rpx;
		image{
			width: 30rpx;
			height: 30rpx;
		}
		view{
			margin:0 34rpx 0 12rpx;
		}
		
	}
	.leiji_ck{
		display: flex;
		font-size: 24rpx;
		color: $qianhui_ziti;
		align-items: center;
		margin-top: 4rpx;
		image{
			width: 14rpx;
			height: 24rpx;
			margin:0 30rpx 0 12rpx;
		}
	}
	
	.kezi_zs{
		font-size: 30rpx;
		color: $heise_ziti;
		font-weight: bold;
		text-align:center;
		margin-bottom: 30rpx;
	}
	
	.me_tubiao {
			border-radius: 12rpx;
			margin: 30rpx;
		}
	.me_content_jine_left {
			width: calc(100% - 60rpx) !important;
			margin: 0 auto;
			padding-top: 10rpx;
			padding-bottom: 10rpx;
		}
	.me_content_list {
			display: flex;
			align-items: center;
			line-height: 90rpx;
			// border-bottom:2rpx solid $qianhui_eee;
			image {
				width: 30rpx;
				height: 30rpx;
				margin-right: 18rpx;
			}
		}
		
		.me_content_list:last-child {
			border-bottom: 0px !important
		}
	
	.me_content_list_list {
		width: calc(100% - 43rpx) !important;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 30rpx;
		color: $heise_ziti;
		border-bottom:2rpx solid $qianhui_eee !important;
		image {
			width: 14rpx;
			height: 24rpx;
			margin-right: 0rpx;
		}
	}
</style>
